<template>
	<view class="pad-lr-20 content">
		<view class="pad-lr-20 pad-tb-20 radius-16 bgfff mar-top-20" v-for="item in AddressList" :key="item.id" @click="aselectaddress(item)">
			<view class="fontSize-30">{{item.name}}   {{item.mobile}}</view>
			<view class="mar-top-24 ">
				<view class="display align-items mar-top-20 ">
					<text class="ml10 fontSize-28">{{item.province}}{{item.city}}{{item.area}}{{item.address}}</text>
				</view>
			</view>
			<view class="display-sb align-items mar-top-32">
			<view class="display align-items">
				<view class="ml10 fontSize-26" v-if="item.is_default==1">默认地址</view>
			</view>
			<view class="display-row-reverse ">
				<view class="display align-items pad-lr-30 border_left_f1" @click.stop="goaddressadd(item.id)">
					<image src="/static/img/edit square.png" class="proudct-item-icon-15" mode=""></image>
					<view class="fontSize-26 col-9 ml10">编辑</view>
				</view>
				<view class="display align-items pad-lr-30" @click.stop="deladdress(item.id)">
					<image src="/static/img/trash.png" class="proudct-item-icon-15" mode=""></image>
					<view class="fontSize-26 col-9 ml10">删除</view>
				</view>
			</view>
			</view>
		</view>
		<view class="display-ce align-items width-100" v-if="AddressList.length==0">
			<tm-result :showBtn="false" subTitle=" " title="暂无数据" color="#bc8c1e"></tm-result>
		</view>
		<view class="poFi bottom-0 bgfff new_view width-100 left-0">
			<view class="col-f text-align-center fontSize-32 radius-40 new_btn" @click="goaddressadd('')">新建收货地址</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
import {address_list,delUserAddress} from '@/utils/api'
import { onLoad, onShow, onUnload } from '@dcloudio/uni-app';
import { ref } from 'vue';
onLoad(()=>{
	_address_list()
})
onShow(()=>{
	uni.$on('addaddress',()=>{
		_address_list()
	})
})
onUnload(()=>{
	uni.$off('addaddress')
})
const AddressList = ref([])//地址列表
const _address_list =() =>{
	address_list().then(res=>{
		if(res.code==1){
			AddressList.value = res.data.address
		}
	})
}
//删除地址
const deladdress =(id:number) =>{
	uni.showModal({
		title: '提示',
		content: '是否删除该地址',
		success: function (res) {
			if (res.confirm) {
				console.log('用户点击确定');
				delUserAddress({id:id}).then(res=>{
					if(res.code==1){
						AddressList.value.forEach((item,index)=>{
							if(item.id==id){
								AddressList.value.splice(index,1)
							}
						})
					}
				})
			} else if (res.cancel) {
				console.log('用户点击取消');
			}
		}
	});
}
const goaddressadd =(id:string|number) =>{
	uni.navigateTo({
		url:'/indexpages/addressadd/addressadd?id='+id
	})
}
//选择地址
const aselectaddress =(info) =>{
	uni.$emit('selectaddress',info)
	
	uni.navigateBack({
		delta:1
	})
}
</script>

<style lang="scss">
@import 'addresslist.scss';
</style>
